<?php
/**
 * Template Name: Home
 *
 * A custom page template without sidebar.
 *
 * The "Template Name:" bit above allows this to be selectable
 * from a dropdown menu on the edit page screen.
 *
 * @package WordPress
 * @subpackage Twenty_Ten
 * @since Twenty Ten 1.0
 */

get_header(); ?>

<div id="hero">
    <div class="container">
        <div id="promo">
            <div class="promo" promo-id="0">
                <a href="/about/">
                    <div class="promo-text">
                        <h1>Welcome to PitchWise!</h1>
                        We provide a central repository of football pitches in Greater London available to book instantly.
                    </div>
                </a>
                <? $image = wp_get_attachment_image_src(get_field('home_image'), "home-banner"); ?>
                <img src="<? echo $image[0]; ?>"/>
            </div>
            <div class="promo" promo-id="1">
                <a href="/pitch-search/">
                    <div class="promo-text">
                        <h1>Find A Local Pitch Now <span style="font-weight: 800">&raquo;</span></h1>
                        We have pitches in every area of the capital
                    </div>
                </a>
                <? $image = wp_get_attachment_image_src(get_field('home_image_1'), "home-banner"); ?>
                <img src="<? echo $image[0]; ?>"/>
            </div>
            <div class="promo" promo-id="2">
                <a href="/registration/">
                    <div class="promo-text">
                        <h1>Register with PitchWise <span style="font-weight: 800">&raquo;</span></h1>
                        Registration is free, allows you to book and be alerted to special offers and promotions.
                    </div>
                </a>
                <? $image = wp_get_attachment_image_src(get_field('home_image_2'), "home-banner"); ?>
                <img src="<? echo $image[0]; ?>"/>
            </div>
        </div>
    </div>
</div>

<div id="cards">
    <div class="container">
        <h1>London's Pitch Database</h1>

        <div class="row-fluid">
            <div class="span4">
                <div class="card">
                    <h3 class="title"><? the_field('card_title_1') ?><span>&raquo;</span></h3>

                    <div class="card-image">
                        <? $image = wp_get_attachment_image_src(get_field('card_image_1'), "card-image"); ?>
                        <img src="<? echo $image[0]; ?>"/>
                    </div>

                    <p><? the_field('card_text_1') ?></p>

                    <a class="btn btn-primary" href="<? the_field('card_url_1') ?>">View details &raquo;</a>
                </div>
            </div>
            <div class="span4">
                <div class="card">
                    <h3 class="title"><? the_field('card_title_2') ?><span>&raquo;</span></h3>

                    <div class="card-image">
                        <? $image = wp_get_attachment_image_src(get_field('card_image_2'), "card-image"); ?>
                        <img src="<? echo $image[0]; ?>"/>
                    </div>

                    <p><? the_field('card_text_2') ?></p>

                    <a class="btn btn-primary" href="<? the_field('card_url_2') ?>">View details &raquo;</a>
                </div>
            </div>
            <div class="span4">
                <div class="card">
                    <h3 class="title"><? the_field('card_title_3') ?><span>&raquo;</span></h3>

                    <div class="card-image">
                        <? $image = wp_get_attachment_image_src(get_field('card_image_3'), "card-image"); ?>
                        <img src="<? echo $image[0]; ?>"/>
                    </div>

                    <p><? the_field('card_text_3') ?></p>

                    <a class="btn btn-primary" href="<? the_field('card_url_3') ?>">View details &raquo;</a>
                </div>
            </div>
        </div>
    </div>
</div>


<div class="container">
    <div class="row-fluid">
        <div class="span6">
            <h3>More Relevant Content <span>&raquo;</span></h3>
            <table class="table table-striped">
                <tbody>
                <tr>
                    <td>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur quis dui non risus commodo
                        mollis. Proin orci quam, sagittis aliquet cursus sed, vestibulum in orci. Ut vitae nulla vitae
                        justo dignissim ornare.
                    </td>
                </tr>
                <tr>
                    <td>
                        Fusce semper sollicitudin posuere. Class aptent taciti sociosqu ad litora torquent per conubia
                        nostra, per inceptos himenaeos. Aliquam ut felis in nisi faucibus imperdiet. Vestibulum sed sem
                        mi. Fusce vehicula feugiat odio a posuere.
                    </td>
                </tr>
                <tr>
                    <td>
                        Fusce semper sollicitudin posuere. Class aptent taciti sociosqu ad litora torquent per conubia
                        nostra, per inceptos himenaeos. Aliquam ut felis in nisi faucibus imperdiet. Vestibulum sed sem
                        mi. Fusce vehicula feugiat odio a posuere.
                    </td>
                </tr>
                </tbody>
            </table>

            <h3>More Relevant Content <span>&raquo;</span></h3>
            <table class="table table-striped">
                <tbody>
                <tr>
                    <td>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur quis dui non risus commodo
                        mollis. Proin orci quam, sagittis aliquet cursus sed, vestibulum in orci. Ut vitae nulla vitae
                        justo dignissim ornare.
                    </td>
                </tr>
                <tr>
                    <td>
                        Fusce semper sollicitudin posuere. Class aptent taciti sociosqu ad litora torquent per conubia
                        nostra, per inceptos himenaeos. Aliquam ut felis in nisi faucibus imperdiet. Vestibulum sed sem
                        mi. Fusce vehicula feugiat odio a posuere.
                    </td>
                </tr>
                <tr>
                    <td>
                        Fusce semper sollicitudin posuere. Class aptent taciti sociosqu ad litora torquent per conubia
                        nostra, per inceptos himenaeos. Aliquam ut felis in nisi faucibus imperdiet. Vestibulum sed sem
                        mi. Fusce vehicula feugiat odio a posuere.
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="span6">
            <h3>Partners</h3>
        </div>
    </div>

</div>

<?php get_footer(); ?>

<script src="<?php echo get_template_directory_uri(); ?>/js/PITCHWISE.home.js"></script>

<script>    $(function () {

    var options = {
    };

    var home = new PITCHWISE.home(options);
});

</script>
